<template>
	<div class="city-header">
		<router-link to="/">
			<div class="page-home"><i class="home-icon"></i></div>
		</router-link>
		<span>城市选择</span>
	</div>
</template>
<script>
	export default {
		name: 'CityHeader'
	}
</script>
<style lang="scss" scoped>
@import '~@/assets/scss/setting';
@import '~@/assets/scss/css3';
@import '~@/assets/scss/mixin';
@import '~@/assets/scss/reset';
@import '~@/assets/scss/style';

.city-header {
	height: px2rem(88px);
	background-color: $bgColor;
	color: #fff;
	font-size: 20px;
	a {
		color: #fff;
	}
	span {
		vertical-align: bottom;
	}
}
.page-home {
	display: inline-block;
	vertical-align: middle;	
	text-align: center;
	line-height: px2rem(88px);
	width: px2rem(88px);
	height: px2rem(88px);
}

</style>